<template>
	<view>
		<!-- 懒加载动画 -->
		<view class="loading-box">
		  <u-loading :show="loadingone" color="#41ADBA" size="70"></u-loading>
		</view>
		<view v-show="!loadingone">
			<view class="topbg">
				<navbar name="健康筛查专业版"></navbar>
				<view class="switchover">
					<!-- <view class="switchover-icon"> -->
					<image src="https://bsyjk-pic.bsyjk.cn/l/70F3551718894962A77F7584746B49A9.png"
						style="width: 28upx;height: 36upx;" mode=""></image>
					<!-- </view> -->
					<input class="switchover-input" :disabled="true" @tap.stop="switchover" type="text"
						:value="storeName?storeName:records[thisindex].storeName" />
					<view class="cut-btn" @tap.stop="switchover">
					</view>
				</view>
			</view>
			<view class="particulars-view">
				<view class="discounts-view">
					<view class="discounts-bg" style="margin-right: 32upx;">
						<view class="jiage-view">
							<view class="price-style">
								<text style="font-size: 20upx;">￥</text>{{discountList[0].cashTicketAmt}}
							</view>
							满{{discountList[0].cashTicketCondition}}可用
						</view>
						<view class="text-righttitle">
							{{discountList[0].name}}
						</view>
					</view>
					<view class="discounts-bg">
						<view class="jiage-view">
							<view class="price-style">
								<text style="font-size: 20upx;">￥</text>{{discountList[1].cashTicketAmt}}
							</view>
							满{{discountList[1].cashTicketCondition}}可用
						</view>
						<view class="text-righttitle">
							{{discountList[1].name}}
						</view>
					</view>
				</view>
				<view class="purchase">
					<view class="title">
						购买说明
					</view>
					<view class="purchase-gz">
						<text>
							1. 此套餐需到门店体验消费，消费时请打开程序找到
							我的-我的订单-订单码，出示验证即可
							3. 如有任何问题请联系客服
							2. 此套餐购买后有效期永久，不可退款
						</text>
					</view>
				</view>
			</view>
			<view class="purchase-bview" :class="iphonex =='iphonex'?'purchase-bviewx':''">
				<view class="timeLimit">
					限时优惠
				</view>
				<view class="afterDiscount">
					￥{{salePrice}}
				</view>
				<view class="originalCost">
					原价¥{{originalPrice}}
				</view>
				<button :disabled="disabled" class="purchase-btn" @tap="orderMd(0)">
					立即购买
				</button>
			</view>
		</view>
	</view>
</template>

<script>
	import location from '@/common/location.js'
	import uLoading from "@/uview-ui/components/u-loading/u-loading.vue"

	export default {
		components: {
			uLoading,
		},
		data() {
			return {
				storeIdTj:'',//推荐门店id
				disabled:false,//是否禁用
				loadingone:false,//懒加载动画
				discountList:[],//优惠券
				GPSDATA: '',
				originalPrice: '', //原价
				salePrice: '', //现价
				iphonex: '',
				records: [], //数组
				pageCurrent: 1, //页数
				pageSize: 10, //数量
				thisindex: 0, //当前索引
				commodityIndex: 0, //商品索引
				storeId: '', //支付使用id
                storeName:'',//门店名称
				goodsId: '',
				skuId: '',
				province:'',//省
				city:'',//市
				district:''//区
			}
		},
		onLoad(e) {
			if(e.storeId){
				this.storeIdTj = e.storeId
			}
			let _this = this;
			this.$basejs.getCityInfo();
			console.info(this.locationres,"locationres")
			// 获取地理位置
			uni.$on('locationres',this.locationres)
			/* uni.$on('locationres',(locationres)=>{
				console.info(locationres,"=this.locationres---")
				this.storeIdTj = locationres.storeId
			}) */

			// uni.getLocation({
			// 	type: 'wgs84',
			// 	success: function(res) {
			// 		console.log('当前位置的经度：' + res.longitude);
			// 		console.log('当前位置的纬度：' + res.latitude);
			// 	}
			// });
			// console.log(location.getCity,'89999999999999999999999')
			this.iphonex = uni.getStorageSync('iphonex');
			this.getCouponList()
		},
		onShow() {
			if (uni.getStorageSync('GPSDATA')) { //选择完成门店
				let GPSDATA = uni.getStorageSync('GPSDATA') //
				this.GPSDATA = GPSDATA;
				this.$set(this.records, this.thisindex, GPSDATA)
			}
		},
		onUnload(){
			 uni.$off('locationres', this.locationres)
		},
		methods: {
			// 获取地理位置
			locationres(data){
				console.info(data,"locationres data")
				let _this = this;
				_this.province = data.province;//省
				_this.city = data.city;//市
				_this.district = data.district;//区
                _this.storeName=data.storeName;//门店名称
                _this.storeId = data.storeId
				_this.thisindex = data.thisindex?data.thisindex:0
				// 获取地理位置附近门店
				_this.storeMd(data.province,data.city,data.district, _this.pageCurrent, _this.pageSize);
			},
			// 获取优惠券
			getCouponList() {
				this.loadingone = true
				let _this = this;
				this.$shopnew.get(global.apiUrls.getCouponList, {}).then(res => {
					if(res.data.code == 1000){
						let discountList = res.data.result;
						_this.discountList = discountList;
					}
					_this.loadingone = false
				})
			},
			// 支付
			payMd(orderId) {
				let _this = this;
				_this.disabled = true;
				let fdata = {
					orderId: orderId, //订单id
					paymentMethodId: '2', //支付方式id
					userId: uni.getStorageSync(global.IS_DEV?'USER_DATA_BSY_T':'USER_DATA_BSY_Z').userId
				}
				this.$shopnew.post(global.apiUrls.payMd, fdata).then(res => {
					if (res.data.code == 1000) {
						let result = res.data.result;
						wx.requestPayment({ //支付
							appId: global.setting.appId,
							timeStamp: result.timeStamp,
							nonceStr: result.nonceStr,
							package: result.package,
							signType: 'RSA',
							paySign: result.paySign,
							success(res) {
								if (res.errMsg == "requestPayment:ok") {
									uni.navigateTo({
										url:'/pagesMy/my/experience/experience'
									})
								}
							}
						})
					}
					_this.disabled = false;
				})
			},
			goodsMd(keyword, pageCurrent, pageSize) {
				let _this = this;
				this.$shopnew.get(global.apiUrls.goodsMd + '?keyword=' + keyword + '&pageCurrent=' + pageCurrent +
					'&pageSize=' + pageSize, {}).then(res => {
					if (res.data.code == 1000) {
						let result = res.data.result
						let commodityIndex = _this.commodityIndex;
						let	storeId = _this.storeId?_this.storeId:_this.records[_this.thisindex].storeId;
						let goodsId = result.goodsId
						_this.goodsId = goodsId;
						_this.storeId = storeId;
						_this.salePrice = result.salePrice;
						_this.originalPrice = result.originalPrice;
						// _this.orderMd()
					}
				})
			},
			// 下单
			orderMd(skuId) {
				let _this = this;
				_this.disabled = true;
				let fdata = {
					goodsId: _this.goodsId,
					skuId: 0,
					storeId: _this.storeId,
					cardTemplateIds: this.discountList[0].cardTemplateId+','+this.discountList[1].cardTemplateId,
					userId: uni.getStorageSync(global.IS_DEV?'USER_DATA_BSY_T':'USER_DATA_BSY_Z').userId
				}
				this.$shopnew.post(global.apiUrls.orderMd, fdata).then(res => {
					if (res.data.code == 1000) {
						_this.payMd(res.data.result)
					}
					_this.disabled = false;
				})
			},
			storeMd(provinceName,cityName,countyName, pageCurrent, pageSize) {
				let _this = this;
				this.$shopnew.get(global.apiUrls.storeMd + '?areaName=&cityName=' + cityName +
					'&countyName='+countyName+'&keyword=&merchantName=&pageCurrent=' + pageCurrent + '&pageSize=' +
					pageSize +
					'&provinceName='+provinceName+'&storeName='+'&storeId='+this.storeIdTj, {}).then(res => {
					let records = res.data.result.records;
					_this.records = records;
					_this.goodsMd('', 1, 10)
				})
			},
			switchover() {
				uni.navigateTo({
					url: '/pages/subpackage/home/ShopToChoose/ShopToChoose?province='+this.province+'&city='+this.city+'&district='+this.district
				})
			}
		}
	}
</script>

<style lang="scss">
	.topbg {
		width: 750upx;
		height: 493upx;
		background: url(https://bsyjk-pic.bsyjk.cn/toprbg/10099E8526734AC383D6ADEED897F016.png)no-repeat;
		background-size: 750upx 493upx;
		padding-top: 28upx;
		box-sizing: border-box;
		position: relative;
	}

	.switchover {
		width: 706upx;
		height: 99upx;
		background: #FFFFFF;
		border-radius: 25upx;
		margin: 20upx auto 0;
		display: flex;
		padding: 30upx 0 0 25upx;

		.switchover-icon {
			width: 30upx;
			height: 38upx;
			background-color: pink;
		}

		.switchover-input {
			width: 530upx;
			font-size: 36upx;
			font-weight: 400;
			color: #333333;
			margin-top: -8upx;
			padding-left: 23upx;
		}

		.cut-btn {
			width: 99upx;
			height: 99upx;
			background: #FFFFFF;
			box-shadow: -2upx 1upx 23upx 3upx rgba(0, 0, 0, 0.06);
			border-radius: 0upx 25upx 25upx 0upx;
			margin-top: -30upx;
			position: relative;
		}

		.cut-btn:before {
			content: '';
			position: absolute;
			top: 26upx;
			right: 34upx;
			width: 36upx;
			height: 36upx;
			background: url(https://bsyjk-pic.bsyjk.cn/arrows/1CB6DDEEB08E4CE0A40E8E86A99D1A0D.png)no-repeat;
			background-size: 36upx 36upx;
			transform: rotate(90deg);
		}
	}

	.particulars-view {
		width: 706upx;
		height: 1718upx;
		// background: #FDF8EC;/
		background: url(http://static.bsyjk.cn/screeningbg/16299B94EA6546EB8B89C6CF89070393.png)no-repeat;
		background-size: 706upx 1618upx;
		margin: -150upx auto 0;
		position: relative;
		z-index: 1;
		padding-top: 1upx;

		.discounts-view {
			width: 630upx;
			height: 161upx;
			margin: 1120upx auto 30upx;
			display: flex;

			.discounts-bg {
				width: 297upx;
				height: 161upx;
				font-size: 36upx;
				font-weight: 400;
				color: #8E7E5D;
				line-height: 50upx;
				background: url(http://static.bsyjk.cn/screeningyhq/C269A14E36E9484D9A81483DF54FDE8B.png)no-repeat;
				background-size: 297upx 161upx;
				font-size: 30upx;
				font-weight: 400;
				color: #9B9B9B;
				line-height: 42upx;
				padding: 10upx 0 0 34upx;
				display: flex;

				.jiage-view {
					width: 200upx;
				}

				.text-righttitle {
					width: 58upx;
					height: 135upx;
					font-size: 36upx;
					font-weight: 400;
					color: #4A4A4A;
					line-height: 45upx;
				}

				.price-style {
					font-size: 48upx;
					font-weight: 400;
					color: #8E7E5D;
					line-height: 80upx;
				}
			}
		}

		.purchase {
			.title {
				width: 130upx;
				height: 42upx;
				background: #FAE692;
				border-radius: 20upx;
				margin: 0 0 0 28upx;
				font-size: 22upx;
				font-weight: 500;
				color: #825C37;
				line-height: 42upx;
				text-align: center;
			}

			.purchase-gz {
				font-size: 22upx;
				font-weight: 400;
				color: #825C37;
				line-height: 34upx;
				padding: 15upx 0 0 35upx;
			}
		}
	}

	.purchase-bview {
		width: 750upx;
		height: 114upx;
		background: #fff;
		position: fixed;
		bottom: 0;
		z-index: 1;
		display: flex;

		.timeLimit {
			width: 148upx;
			height: 48upx;
			border-radius: 10upx 0 10upx 0;
			background: #FF333A;
			text-align: center;
			line-height: 48upx;
			font-size: 24upx;
			color: #fff;
		}

		.afterDiscount {
			min-width: 170upx;
			height: 84upx;
			font-size: 48upx;
			font-weight: 600;
			color: #FF333A;
			line-height: 84upx;
			text-align: center;
		}

		.originalCost {
			min-width: 170upx;
			height: 84upx;
			font-size: 30upx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #9B9B9B;
			line-height: 96upx;
			text-decoration:line-through;
		}

		.purchase-btn {
			width: 229upx;
			height: 68upx;
			background: linear-gradient(270deg, #F85032 0%, #E73827 100%);
			border-radius: 34upx;
			font-size: 26upx;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 68upx;
			text-align: center;
			margin-top: 24upx;
		}
	}

	.purchase-bviewx {
		height: 150upx;
	}
</style>
